/** * 查询 - doc * */
<template>
  <div class="w-table-earch" @click="show">
    <form action="/">
      <van-search
        v-model.trim="value"
        show-action
        placeholder="请输入搜索关键词"
        @search="save"
      >
        <template #action>
          <div @click="save">搜索</div>
        </template>
      </van-search>
    </form>
  </div>
</template>
<script>
export default {
  props: ['modelValue'],
  emits: ['update:modelValue', 'change'],
  computed: {
    value: {
      get() {
        return this.modelValue
      },
      set(value) {
        this.$emit('update:modelValue', value)
        this.$emit('change', value)
      },
    },
  },
  created() {},
  mounted() {
    if (this.$route.query.keyword) {
      this.value = this.$route.query.keyword
    }
  },
  methods: {
    show() {
      this.$router.push({
        path: '/search',
        query: {
          path: this.$route.path,
        },
      })
    },
    save() {
      this.$emit('update:modelValue', this.value)
      this.$emit('change', this.value)
    },
  },
}
</script>

<!-- 这里用来写私有的css -->
<style lang="scss" scoped></style>
